<template>
  <div id="test">
    <canvas id="canvas"></canvas>
  </div>
</template>

<script>

export default {
  name: "test",

  data() {
    return {}
  },

  mounted() {


  },


  methods: {}

}
</script>

<style scoped>
#test {
  width: 100%;
  height: 100vh;
  background: linear-gradient(125deg, #2c3e50, #27ae60, #2980b9, #e74c3c, #8e44ad);
  background-size: 500%;
  animation: bgAnimation 15s linear infinite;
}

@keyframes bgAnimation {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}
</style>